<template>
    <base-panel>
        <top-simple-search @addFun="toAdd" @searchFun="toSearch" >
          <el-button
            slot="other-button"
            type="primary"
            size="small"
            plain  @click="toTongbu" v-has-permi="['tongbu']">同步</el-button>
        </top-simple-search>
        <simple-table ref="myTable" :formatter="dataFormatter">
          <el-table-column align="left" prop="username" label="名称" show-tooltip-when-overflow min-width="250">
            <template slot-scope="{ row }">
              <span @click="setRowExpands(row)" style="cursor: pointer">{{ row.name }}</span>
            </template>
          </el-table-column>
            <el-table-column align="left" prop="parent_dept_info.parent_dept_name" label="上级部门" width="200"/>
            <el-table-column align="left" prop="approver" label="负责人" :formatter="approverFormatter" width="150"/>
            <my-time-column align="left" prop="gmt_created" label="创建时间"/>
          <my-dict-column label="状态" align="center" prop="status" dist-key="button_status_bool"></my-dict-column>
            <el-table-column align="left" label="操作" width="200">
                <template slot-scope="{row}">
                    <detail-button @click="toDetail(row)"></detail-button>
                    <edit-button @click="toEdit(row)"></edit-button>
                    <delete-button @click="toDelete(row.id)"></delete-button>
                </template>
            </el-table-column>
        </simple-table>
        <detail-dialog :visible.sync="visible" v-if="visible" @reloadList="getList" :row="currRow" :disabled="disabled"></detail-dialog>
    </base-panel>

</template>
<script>
    import dept from "@/api/systemManagement/dept/index"
    import DetailDialog from "./DetailDialog";
    import simpleTable from "@/mixins/SimpleTable";
    import XEUtils from "xe-utils";
    import DeptSelectTree from "@/components/Common/DeptSelectTree";
    import MyTimeColumn from '../../../components/TableColumn/MyTimeColumn'
    import MySwitchColumn from '../../../components/TableColumn/MySwitchColumn'
    import MyDictColumn from '../../../components/TableColumn/MyDictColumn'
    export default {
        mixins:[simpleTable],
        components: { MyDictColumn, MySwitchColumn, MyTimeColumn, DeptSelectTree, DetailDialog},
        data(){
            return{
                formData:{
                    search_value:undefined
                },
            }
        },
        created() {
        },
        methods:{
          setRowExpands(row){
            if(this.expands.includes(row.id)){
              this.expands=this.expands.filter(val=>val !=row.id);
              this.$refs["my-table"].toggleRowExpansion(row,false)
            }else{
              this.expands.push(row.id);
              this.$refs["my-table"].toggleRowExpansion(row,true)
            }
          },
          toTongbu(){
            dept.deptsTongbu().then(res=>{
              this.msgSuccess(res.msg);
            })
          },
          approverFormatter(row){
            if(row.approver_info){
              let list= row.approver_info.map(item=>{
                return item.alias
              });
              return list.join(",")
            }
            return ""
          },
            toSearch(params){
                this.formData.search_value=params;
                this.getList(this.formData)
            },
            dataFormatter(data){
                this.list = XEUtils.toArrayTree(data, {
                    parentKey: 'parent_dept',
                    key: 'id',
                    children: 'children'
                });
                return this.list
            },
        }
    }
</script>
